<template>
    <div class="seller-bind-card">
        <search-form :searchArray="searchArray" :searchObj="searchObj">
        </search-form>
        <elTable :formData="formData">
                <el-table-column prop="name" label="厂商名称" align="center"></el-table-column>
                <el-table-column prop="bankName" label="银行名称" align="center"></el-table-column>
                <el-table-column prop="user" label="用户名" align="center"></el-table-column>
                <el-table-column prop="account" label="平安银行开户名" align="center"></el-table-column>
                <el-table-column prop="childAccount" label="平安银行子账户" align="center"></el-table-column>
                <el-table-column prop="amount" label="可用余额" align="center"></el-table-column>
                <el-table-column prop="isBind" label="是否已绑卡" align="center"></el-table-column>
                <el-table-column prop="action" label="操作" align="center" width="120px;" fixed="right">
                    <template slot-scope="scope">
                        <el-button type="text"  @click="bindCard(scope.row)">绑卡</el-button>
                        <el-button type="text"  @click="unBindCard(scope.row, scope.$index)">解绑</el-button>
                        <el-button type="text"  @click="openUser(scope.row, scope.$index)">开户</el-button>
                        <el-button type="text"  @click="destoryUser(scope.row, scope.$index)">销户</el-button>
                    </template>
                </el-table-column>
        </elTable>
    </div>
</template>
<script>
import elTable from "@/components/xForm/elTable"
export default {
    name: 'sellerBindCard',
    components: {
        elTable
    },
    data () {
        return {
            formData: {
                currentPage: 1,
                pageSize: 10,
                total: 2,
                data: [
                    {
                        id: '1',
                        name: '深圳市南北医药有限公司',
                        isBind: '是',
                        bankName: '中国工商',
                        amount: 10
                    },
                    {
                        id: '2',
                        name: '四川偌好生物科技有限公司',
                        isBind: '否',
                        bankName: '中国银行',
                        amount: 12
                    }
                ]
            },
            formDatas: {
                currentPage: 1,
                pageSize: 10,
                total: 2,
                data: [
                    {
                        id: '3',
                        name: '老百姓大药房2',
                        phone: '15558007253',
                        area: '广东省_广州市_花都区'
                    }
                ]
            },
            searchObj: {
                name: '',
                phone: '',
                area: ''
            },
            searcA: [
                {
                    type: 'input',
                    value: '',
                    label: '终端客户名称',
                    placeholder: '请输入终端客户名称',
                    key: 'name'
                }
            ],
            searchArray: [
                {
                    type: 'input',
                    value: '',
                    label: '厂商名称',
                    placeholder: '请输入厂商名称',
                    key: 'name'
                },
                {
                    type: 'input',
                    value: '',
                    label: '用户名',
                    placeholder: '请输入用户名',
                    key: 'name'
                },
                {
                    type: 'select',
                    value: '',
                    label: '是否已开户',
                    placeholder: '请选择',
                    list: [
                        {label: '是', value: 1},
                        {label: '否', value: 0}
                    ]
                },
                {
                    type: 'select',
                    value: '',
                    label: '是否已绑卡',
                    placeholder: '请选择',
                    list: [
                        {label: '是', value: 1},
                        {label: '否', value: 0}
                    ]
                },
                {
                    type: 'select',
                    value: '',
                    label: '账号类型',
                    placeholder: '请选择',
                    list: [
                        {label: '是', value: 1},
                        {label: '否', value: 0}
                    ]
                },
            ],
            visible: {
                show: false
            }
        }
    },
    methods: {
        bindCard () {
            
        },
        unBindCard () {
            this.$confirm('确定要解绑?', '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
                }).then(() => {
                    this.formData.data.splice(index,1)
                    this.$message.success('删除成功')
                }).catch(() => {
            })
        },
        openUser () {
            this.$confirm('确定要开户?', '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
                }).then(() => {
                    this.formData.data.splice(index,1)
                    this.$message.success('删除成功')
                }).catch(() => {
            })
        },
        destoryUser () {
            this.$confirm('确定要销户?', '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
                }).then(() => {
                    this.formData.data.splice(index,1)
                    this.$message.success('删除成功')
                }).catch(() => {
            })
        }
    }
}
</script>
<style lang="scss" scoped>
.seller-bind-card {
    .search-form {
        margin-bottom: 16px;
    }
}
</style>